﻿<%@ page language="java" contentType="text/html;charset=utf-8"
	pageEncoding="utf-8" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Design Pattern Config</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">

<!-- Le styles -->
<link href="<c:url value='/css/bootstrap.min.css'/>" rel="stylesheet">
<link href="<c:url value='/css/bootstrap-responsive.css'/>" rel="stylesheet">

</head>
<body>

	<div class="container">
		<div class="tabbable" style="padding-top: 50px;">
			<div class="tabbable" style="margin-bottom: 18px;">
				<ul class="nav nav-tabs">
					<li class="active"><a href="#tab1" data-toggle="tab">总线通信</a></li>
					<li class=""><a href="#tab2" data-toggle="tab">IO通信</a></li>
					<li class=""><a href="#tab3" data-toggle="tab">信息显示</a></li>
					<li class=""><a href="#tab4" data-toggle="tab">控制响应</a></li>
				</ul>
				<div class="tab-content"
					style="padding-bottom: 9px; border-bottom: 1px solid #ddd;">
					<div class="tab-pane active form-horizontal" id="tab1">
							<div class="control-group span9">
								<label class="control-label" for="">设计模式文件名称</label>
								<div class="controls">
									<span class="uneditable-input input-large"><c:out value="${dpiFileName}"></c:out> </span>
								</div>
							</div>
							<div class="control-group span9">
								<label class="control-label" for="">设计模式实例名称</label>
								<div class="controls">
									<span class="uneditable-input input-large"><c:out value="${dpiName}"></c:out></span>
								</div>
							</div>
							
							<div class="control-group span9">
								<label class="control-label" for="dataZone">已有外部设备</label>
								<div class="controls">
									<div class="btn-group">
										<a class="btn btn-primary" href="#add_equipment">增加</a>
										<button class="btn btn-primary" onclick="window.location.href='<%=request.getContextPath()%>/${dpcUri.replace(':','/')}/generateCode';">生成代码</button>
									</div>
                                    <div>
                                    <p/>
									<table class="table table-hover table-striped table-bordered">
										<thead>
											<tr>
                                            	<th>#</th>
												<th>外部设备名称</th>
                                                <th>描述</th>
												<th>操作</th>
											</tr>
										</thead>
										<tbody>
											<c:forEach items="${exist_equipments}" var="equipment" varStatus="status">
											<tr>
                                            	<td>${status.count}</td>
												<td>${equipment.name}</td>
                                                <td>${equipment.description}</td>
												<td>
													<div class="btn-group">
														<button class="btn btn-info" name="view_equipment" data-target="#dp_component_info_panel" data-toggle="modal">详细</button>
														<button class="btn btn-warning" name="delete_equipment">删除</button>
														<input type="hidden" value="${equipment.uri }"/>
													</div>
												</td>
											</tr>
											</c:forEach>
										</tbody>
									</table>
                                    </div>
								</div>
							</div>

		
							<div class="control-group span9" id="add_equipment">
								<form class="form-horizontal" action="<%=request.getContextPath()%>/busDesignPattern/add" method="post">
								<input type="hidden" name="dpiFileName" value="${dpiFileName}"></input> 
								<input type="hidden" name="dpiName" value="${dpiName}"></input>
								<input type="hidden" name="dpcUri" value="${dpcUri}"></input>
								
								<label class="control-label" for="dataZone">添加外部设备</label>
								<div class="controls">
										<br></br>
										<legend>外部设备</legend>
                                        <div class="control-group">
											<label class="control-label" for="equipment">设备</label>
											<div class="controls">
												<select name="equipment">
													<c:forEach items="${equipments}" var="equipment">
														<option value="${equipment.uri}">
															<c:out value="${equipment.name}"></c:out>
														</option>
													</c:forEach>									
												</select>
											</div>
										</div>
                                            
  										<div class="control-group">
											<label class="control-label" for="busType">总线类型</label>
											<div id="busType" class="controls" >
												<select name="bus_type">
													<c:forEach items="${buses}" var="bus">
														<option value="${bus.uri}">
															<c:out value="${bus.name}"></c:out>
														</option>
													</c:forEach>
												</select>
											</div>
										</div>
										
                                        <legend>总线数据区</legend>
                                        <div class="control-group">
											<label class="control-label" name="bus_data_area_label" for="bus_data_area">总线数据区</label>
											<div id="type" class="controls">
												<input type="text" name="bus_data_area" placeholder="请输入总线数据区名称"></input>
                                                <span class="help-block">请输入英文名称，例如 ins_data_area</span>
											</div>
										</div>
                                                
                                        <div class="control-group">
											<label class="control-label" for="busType">映射实体数据区</label>
											<div id="type" class="controls">
												<button class="btn" data-target="#data_component_panel" data-toggle="modal">增加</button>
												<p />
												<input type="hidden" name="entity_data_area" value=""/>
												<table class="table table-bordered" id="data_component_table" >
													<thead>
														<tr>
															<th>#</th>
															<th>数据实体</th>
														</tr>
													</thead>
													<tbody></tbody>
												</table>
											</div>
										</div>
                                                
                                        <legend>共享内存区</legend>
                                        <div class="control-group">
											<label class="control-label" name="" for="busType">外部设备号</label>
											<div id="type" class="controls">
												<input type="text" name="equipment_number" placeholder="请输入数字"></input>
											</div>
										</div>
                                                
                                        <legend>读写代理</legend>                                                                                      
                                        <div class="control-group">
                                            <label class="control-label" for="read_bus_processing_method">总线读数据处理函数</label>
                                            <div class="controls">
                                            	<select  name="read_bus_processing_method" >
                                            		<!--  <option>INS_BUS_READ_PROCESSING();</option>
													<option>AHRS_BUS_READ_PROCESSING();</option>
													<option>ATM_BUS_READ_PROCESSING();</option>-->
                                            		<c:forEach items="${interfaceMethods }" var="read_method">
                                            			<option value="${read_method.id}"><c:out value="${read_method.methodSigniture}"></c:out></option>
                                            		</c:forEach>
												</select>
                                            </div>
                                        </div>
                                                                  
      									<div class="control-group">
                                            <label class="control-label" for="read_frequency">执行频率</label>
                                            <div class="controls">
                                                <input type="text" name="read_frequency" /> Hz
                                            </div>
                                        </div>
                                                                    
                                        <div class="control-group">
											<label class="control-label" for="write_bus_processing_method">总线写数据处理函数</label>
                                            <div class="controls">
												<select  name="write_bus_processing_method" >
													<c:forEach items="${interfaceMethods }" var="write_method">
                                            			<option value="${write_method.id}">
                                            				<c:out value="${write_method.methodSigniture}"></c:out>
                                            			</option>
                                            		</c:forEach>
												</select>
											</div>
                                        </div>
                                                                
                                        <div class="control-group">
											<label class="control-label" for="write_frequency">执行频率</label>
                                            <div class="controls">
                                                <input type="text" name="write_frequency" /> Hz
                                            </div>
                                        </div>							
                            
										<div class="control-group">
											<div class="controls">
											<button type="submit" class="btn btn-primary">确认</button>
											<button type="reset" class="btn">取消</button>
											</div>
										</div>
								</div>
								</form>
							</div>
					</div>
                    
					<div class="tab-pane" id="tab2">
						<form class="form-horizontal">
							<div class="control-group">
								<label class="control-label" for="busType">IO设备</label>
								<div class="controls">
									<div class="tabbable"> <!-- Only required for left/right tabs -->
									  <ul class="nav nav-tabs">
										<li class="active"><a href="#tab8" data-toggle="tab">DCP</a></li>
										<li class=""><a href="#tab9" data-toggle="tab">DTD</a></li>
										<li class=""><a>+</a></li>
									  </ul>
									  <div class="tab-content">
										<div class="tab-pane active" id="tab8">
											<div class="control-group">
												<label class="control-label" for="busType">内部总线类型</label>
												<div class="controls">
													<select>
														<option>1553B</option>
														<option>RS422</option>
														<option>HDLC</option>
														<option>CPCI</option>
													</select>
												</div>
											</div>
										</div>
										<div class="tab-pane" id="tab9">
											<label class="control-label" for="busType">内部总线类型</label>
											<div class="controls">
												<select>
													<option>1553B</option>
													<option>RS422</option>
													<option>HDLC</option>
													<option>CPCI</option>
												</select>
											</div>
										</div>
									  </div>
									</div>
								</div>
							</div>
							<div class="control-group">
								<label class="control-label" for="sharedMemory">共享内存区</label>
								<div id="sharedMemory" class="controls">
									<div class="btn-group">
										<button class="btn">增加</button>
										<button class="btn">删除</button>
									</div>
									<table class="table table-striped">
										<thead>
											<tr>
												<th>#</th>
												<th>IO设备</th>
												<th>设备号</th>
												<th>操作</th>
											</tr>
										</thead>
										<tbody>
											<tr>
												<td><input type="checkbox"></td>
												<td>DCP</td>
												<td>13</td>
												<td>
													<div class="btn-group">
														<button class="btn">编辑</button>
														<button class="btn">删除</button>
													</div>
												</td>
											</tr>
											<tr>
												<td><input type="checkbox"></td>
												<td>DTD</td>
												<td>21</td>
												<td>
													<div class="btn-group">
														<button class="btn">编辑</button>
														<button class="btn">删除</button>
													</div>
												</td>
											</tr>
										</tbody>
									</table>
								</div>
							</div>

							<div class="control-group">
								<div class="controls">
									<button type="submit" class="btn">确认</button>
								</div>
							</div>
						</form>
					</div>
					<div class="tab-pane" id="tab3">
						<form class="form-horizontal">
							<div class="control-group">
								<label class="control-label" for="viewData">显示数据区</label>
								<div id="viewData" class="controls">
									<div class="btn-group">
										<button class="btn">增加</button>
										<button class="btn">删除</button>
									</div>
									<table class="table table-striped">
										<thead>
											<tr>
												<th>#</th>
												<th>数据区</th>
												<th>类型/大小</th>
												<th>操作</th>
											</tr>
										</thead>
										<tbody>
											<tr>
												<td><input type="checkbox"></td>
												<td>页面号</td>
												<td>Integer</td>
												<td>
													<div class="btn-group">
														<button class="btn">编辑</button>
														<button class="btn">删除</button>
													</div>
												</td>
											</tr>
											<tr>
												<td><input type="checkbox"></td>
												<td>光标位置</td>
												<td>Integer</td>
												<td>
													<div class="btn-group">
														<button class="btn">编辑</button>
														<button class="btn">删除</button>
													</div>
												</td>
											</tr>
											<tr>
												<td><input type="checkbox"></td>
												<td>相对距离</td>
												<td>Float[]</td>
												<td>
													<div class="btn-group">
														<button class="btn">编辑</button>
														<button class="btn">删除</button>
													</div>
												</td>
											</tr>
											<tr>
												<td><input type="checkbox"></td>
												<td>预计到达时间</td>
												<td>Float[]</td>
												<td>
													<div class="btn-group">
														<button class="btn">编辑</button>
														<button class="btn">删除</button>
													</div>
												</td>
											</tr>
										</tbody>
									</table>
								</div>
							</div>
							<div class="control-group">
								<label class="control-label" for="viewData">显示通信协议</label>
								<div id="viewData" class="controls">
									<select>
										<option>ARINC 661</option>
										<option>自定义DF</option>
										<option>页面数据</option>
									</select>
								</div>
							</div>
							<div class="control-group">
								<label class="control-label" for="viewData">显示频率</label>
								<div id="viewData" class="controls">
									<input type="text"/>Hz
								</div>
							</div>
							<div class="control-group">
								<label class="control-label" for="pageList">页面列表</label>
								<div id="pageList" class="controls">
									<table class="table table-striped">
										<thead>
											<tr>
												<th class="span3">页面列表</th>
												<th class="span7">页面详情</th>
											</tr>
										</thead>
										<tbody>
											<tr>
												<td>
													<select multiple="multiple" style="height:300px;">
													  <option>首页</option>
													  <option>航线列表</option>
													  <option>航线详情</option>
													  <option>航路点列表</option>
													  <option>航路点详情</option>
													  <option>导航</option>
													</select>
													<button class="btn" type="button">新增页面</button>
												</td>
												<td>
													<div class="tabbable"> <!-- Only required for left/right tabs -->
													  <ul class="nav nav-tabs">
														<li class="active"><a href="#tab10" data-toggle="tab">图形界面</a></li>
														<li class=""><a href="#tab11" data-toggle="tab">DF文档</a></li>
														<li class=""><a href="#tab12" data-toggle="tab">属性</a></li>
														<li class=""><button class="btn" type="button">上传页面</button></li>
													  </ul>
													  <div class="tab-content">
														<div class="tab-pane active" id="tab10">
															<img style="height:250px;" src="img/飞行界面原型.jpg" class="img-polaroid"/>
														</div>
														<div class="tab-pane" style="height:250px;" id="tab11">
															<pre>&lt;page&gt; <br/>	&lt;layout&gt; <br/>		&lt;layer&nbsp;id=&quot;default_layer&quot;&gt; <br/>			&lt;!--&nbsp;静态数据&nbsp;--&gt; <br/>			&lt;label&nbsp;id=&quot;page_entry_points&quot;&nbsp;x=&quot;10&quot;&nbsp;y=&quot;250&quot;&nbsp;value=&quot;航路点&quot;/&gt; <br/>			&lt;label&nbsp;id=&quot;page_entry_routes&quot;&nbsp;x=&quot;10&quot;&nbsp;y=&quot;350&quot;&nbsp;value=&quot;航线&quot;/&gt; <br/>			&lt;label&nbsp;id=&quot;page_entry_navigate&quot;&nbsp;x=&quot;250&quot;&nbsp;y=&quot;550&quot;&nbsp;value=&quot;导航&quot;/&gt; <br/>			&lt;label&nbsp;id=&quot;back&quot;&nbsp;x=&quot;450&quot;&nbsp;y=&quot;550&quot;&nbsp;value=&quot;返回&quot;/&gt; <br/>			&lt;label&nbsp;id=&quot;page_entry_flight_params&quot;&nbsp;x=&quot;740&quot;&nbsp;y=&quot;250&quot;&nbsp;value=&quot;航参&quot;/&gt; <br/>			&lt;label&nbsp;id=&quot;function_exam&quot;&nbsp;x=&quot;740&quot;&nbsp;y=&quot;350&quot;&nbsp;value=&quot;自检&quot;/&gt; <br/> <br/>			&lt;label&nbsp;id=&quot;label_time&quot;&nbsp;x=&quot;270&quot;&nbsp;y=&quot;250&quot;&nbsp;value=&quot;时间&quot;/&gt; <br/>			&lt;label&nbsp;id=&quot;label_coordinator&quot;&nbsp;x=&quot;270&quot;&nbsp;y=&quot;350&quot;&nbsp;value=&quot;坐标&quot;/&gt; <br/> <br/>			&lt;!--&nbsp;动态数据&nbsp;--&gt; <br/>			&lt;label&nbsp;id=&quot;value_time&quot;&nbsp;x=&quot;350&quot;&nbsp;y=&quot;250&quot;&nbsp;bind=&quot;@{time}&quot;/&gt; <br/>			&lt;label&nbsp;id=&quot;value_coordinator&quot;&nbsp;x=&quot;350&quot;&nbsp;y=&quot;350&quot;&nbsp;bind=&quot;@{lontitude},@{latitude}&quot;/&gt; <br/>		&lt;/layer&gt; <br/>	&lt;/layout&gt; <br/>&lt;/page&gt;</pre>
														</div>
														<div class="tab-pane" style="height:250px;" id="tab12">
															<label class="control-label" for="frequency">显示数据处理函数</label>
															<div class="controls">
																<input type="text" value="INDEX_PAGE_PROCESSING();" />
																<button type="button" class="btn">选择</button>
															</div>
														</div>
													  </div>
													</div>
												</td>
											</tr>
										</tbody>
									</table>
								</div>
							</div>
							<div class="control-group">
								<div class="controls">
									<button type="submit" class="btn">确认</button>
								</div>
							</div>
						</form>
					</div>
					<div class="tab-pane" id="tab4">
						<form class="form-horizontal">
							<div class="control-group">
								<label class="control-label" for="busType">键码定义</label>
								<div class="controls">
									<div class="btn-group">
										<button class="btn">增加</button>
										<button class="btn">删除</button>
									</div>
									<table class="table table-striped">
										<thead>
											<tr>
												<th>#</th>
												<th>键码</th>
												<th>按键</th>
												<th>操作</th>
											</tr>
										</thead>
										<tbody>
											<tr>
												<td><input type="checkbox"></td>
												<td>0x00054</td>
												<td>MFD周边键左1</td>
												<td>
													<div class="btn-group">
														<button class="btn">编辑</button>
														<button class="btn">删除</button>
													</div>
												</td>
											</tr>
											<tr>
												<td><input type="checkbox"></td>
												<td>0x00055</td>
												<td>MFD周边键左2</td>
												<td>
													<div class="btn-group">
														<button class="btn">编辑</button>
														<button class="btn">删除</button>
													</div>
												</td>
											</tr>
											<tr>
												<td><input type="checkbox"></td>
												<td>0x00056</td>
												<td>MFD周边键左3</td>
												<td>
													<div class="btn-group">
														<button class="btn">编辑</button>
														<button class="btn">删除</button>
													</div>
												</td>
											</tr>
											<tr>
												<td><input type="checkbox"></td>
												<td>0x00057</td>
												<td>MFD周边键左4</td>
												<td>
													<div class="btn-group">
														<button class="btn">编辑</button>
														<button class="btn">删除</button>
													</div>
												</td>
											</tr>
											<tr>
												<td><input type="checkbox"></td>
												<td>0x00058</td>
												<td>MFD周边键下1</td>
												<td>
													<div class="btn-group">
														<button class="btn">编辑</button>
														<button class="btn">删除</button>
													</div>
												</td>
											</tr>
											<tr>
												<td><input type="checkbox"></td>
												<td>0x00059</td>
												<td>MFD周边键下2</td>
												<td>
													<div class="btn-group">
														<button class="btn">编辑</button>
														<button class="btn">删除</button>
													</div>
												</td>
											</tr>
										</tbody>
									</table>
								</div>
							</div>
							<div class="control-group">
								<label class="control-label" for="frequency">轮询频率</label>
								<div class="controls">
									<input type="text" />Hz
								</div>
							</div>
							<div class="control-group">
								<label class="control-label" for="sharedMemory">控制响应表</label>
								<div id="sharedMemory" class="controls">
									<div class="btn-group">
										<button class="btn">增加</button>
										<button class="btn">删除</button>
									</div>
									<table class="table table-striped">
										<thead>
											<tr>
												<th>#</th>
												<th>页面</th>
												<th>键码</th>
												<th>控制响应函数</th>
												<th>操作</th>
											</tr>
										</thead>
										<tbody>
											<tr>
												<td><input type="checkbox"></td>
												<td>首页</td>
												<td>MFD周边键左2</td>
												<td>DISPLAY_FLIGHT_POINTS();</td>
												<td>
													<div class="btn-group">
														<button class="btn">编辑</button>
														<button class="btn">删除</button>
													</div>
												</td>
											</tr>
											<tr>
												<td><input type="checkbox"></td>
												<td>首页</td>
												<td>MFD周边键左4</td>
												<td>DISPLAY_ROUTE_POINTS();</td>
												<td>
													<div class="btn-group">
														<button class="btn">编辑</button>
														<button class="btn">删除</button>
													</div>
												</td>
											</tr>
											<tr>
												<td><input type="checkbox"></td>
												<td>首页</td>
												<td>MFD周边键下2</td>
												<td>DISPLAY_NAVIGATE();</td>
												<td>
													<div class="btn-group">
														<button class="btn">编辑</button>
														<button class="btn">删除</button>
													</div>
												</td>
											</tr>
										</tbody>
									</table>
								</div>
							</div>
							<div class="control-group">
								<label class="control-label" for="frequency">其他操作</label>
								<div class="controls">
									<button type="button" class="btn">建立事件响应</button>
								</div>
							</div>
							<div class="control-group">
								<div class="controls">
									<button type="submit" class="btn">确认</button>
								</div>
							</div>
						</form>
					</div>
				</div>
			</div>
			<!-- /tabbable -->
		</div>
		</div>
		
	<div class="modal hide fade" id="data_component_panel">
		<div class="modal-header">
			<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
			<h3>添加数据实体组件</h3>
		</div>
		<div class="modal-body">
			<c:forEach items="${data_components}" var="dcom" >
				<div id="data_area_input" class="control-group">
					<label class="checkbox" > 
						<input type="checkbox" value="${dcom.uri}" />
						<c:out value="${dcom.name}"></c:out> 
					</label>
				</div>
			</c:forEach>
		</div>
		<div class="modal-footer">
			<button class="btn" data-dismiss="modal" aria-hidden="true">关闭</button>
			<button class="btn btn-primary" id="add_data_component">保存</button>			
		</div>
	</div>
	
	<div class="modal hide fade" id="dp_component_info_panel">
		<div class="modal-header">
			<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
			<h3>外部设备详细信息</h3>
		</div>
		<div class="modal-body">
			<table class="table table-hover" style="width:80%">
				<thead>
					<tr>
						<th style="width:30%">属性</th>
						<th style="width:70%">详细信息</th>
					</tr>
				</thead>
				<tbody>
					<tr>
						<td>设备名称</td>
						<td ><span id="equipment_info"></span></td>
					</tr>
					
					<tr>
						<td>总线类型</td>
						<td><span id="bus_type_info"></span></td>
					</tr>
					<tr>
						<td>总线数据区</td>
						<td><span id="bus_data_area_info"></span></td>
					</tr>
					<tr>
						<td>映射的数据实体</td>
						<td><span id="entity_data_areas_info"></span></td>
					</tr>
					<tr>
						<td>外部设备号</td>
						<td><span id="equipment_number_info"></span></td>
					</tr>
					<tr>
						<td>总线读处理函数</td>
						<td><span id="read_bus_processing_method_info"></span></td>
					</tr>
					<tr>
						<td>执行频率</td>
						<td><span id="read_frequency_info"></span></td>
					</tr>
					<tr>
						<td>总线写处理函数</td>
						<td><span id="write_bus_processing_method_info"></span></td>
					</tr>
					<tr>
						<td>执行频率</td>
						<td><span id="write_frequency_info"></span></td>
					</tr>
				</tbody>
            </table>
		</div>
		<div class="modal-footer">
			<button class="btn" data-dismiss="modal" aria-hidden="true">关闭</button>
			<button class="btn btn-primary" id="view_equipment_info">确定</button>			
		</div>
	</div>
		
		<!-- Le javascript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="<c:url value='/js/jquery.min.js'/>"></script>
    <script src="<c:url value='/js/bootstrap.min.js'/>"></script>
	<script src="<c:url value='/js/config_design_pattern.js'/>"></script>
		
</body>
</html>